<style scoped lang="less">
  .border {
    border: 1px solid #ddd;
  }

  .item.active {
    background: #f6f7f9;
  }

  .m-item {
    background: none !important;
    border: 0 !important;
  }

  /deep/ .el-scrollbar .el-scrollbar__wrap {
    overflow-x: hidden;
  }

  .wrapperSystemItem {
    display: flex;
    border-bottom: 1px solid #dddd;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    align-items: center;
    cursor: pointer;

    .wrapperIconLaba {
      border-radius: 100%;
      border: 1px solid #ddd;
      width: 45px;
      height: 45px;
      display: flex;
      justify-content: center;
      align-items: center;

      .iconfont.icon-laba {
        font-size: 20px;
      }
    }
  }

</style>
<template>
  <div :class="{'w100 ': isDesMobile}">
    <el-scrollbar v-loading="loadingClickConversation" style="height: 680px;overflow-x:hidden;padding-bottom: 40px;border-right: 1px solid #ddd;">
      <div
        v-for="(item,index) in conversationList_"
        v-if="item&&item.type!='@TIM#SYSTEM'"
        :key="index"
        :class="{'active':currentConversation&&currentConversation.conversationID==item.conversationID, 'm-item' : isDesMobile}"
        class="item flex flex-c-c  border-bottom-space"
        @click="()=>selectConversation(item)"
      >
        <leftMenuItem :item="item" />
      </div>
      <!--    系统消息  -->
      <!-- <div
        class="wrapperSystemItem"
        :class="{'active':!currentConversation, 'm-item' : isDesMobile}"
        @click="selectSystemItem"
      >
        <div
          class="wrapperIconLaba"
        >
          <i class="iconfont icon-laba" style="font-size: 20px;" />
        </div>
        <span style="padding-left: 10px;">系统消息</span>
      </div> -->
    </el-scrollbar>

  </div>
</template>
<script>
import { createProp } from '@/tim';
import messageStoreMixin from '@/store/message/messageStoreMixin';
import defaultImage from '@/assets/images/avatar.png'
import findComponentUpward from '@/tim/vueFindComponent/findComponentUpward';
import { mapGetters } from 'vuex';
import { setCookie } from '@/tim';
import { getLoginUser } from '@/tim';
import { personage_system_group, type_reservation_status_waiting, type_src_supplier } from '@/tim/constact';
import { getProjectId } from '@/tim';
import ajax from '@/tim/ajax';
import { commit_set_currentConversation } from '@/store/message/MessageStoreUtil';

export default {
  mixins: [messageStoreMixin],
  data () {
    return {
      loadingClickConversation: false,
      defaultImage,
    }
  },
  props: {
    value: createProp(String)
  },
  computed: {
    ...mapGetters('mobile', [
      'isDesMobile'
    ]),
    ...mapGetters('message', [
      'systemGroupConversation'
    ]),
    // 过v 群的
    conversationList_ () {
      var secounds = this.conversationList && this.conversationList.filter && this.conversationList.filter(item => {
        return item && item.type != 'GROUP'
      })
      return secounds
    }
  },
  mounted () {
  },
  components: {
    leftMenuItem: () => import('./leftMenuItem')
  },
  methods: {
    async clickSystemItem (conversation) {
      await window.tim.setMessageRead({ conversationID: conversation.conversationID })
      window._vm.$store.commit('message/set_currentMessageList', [])
      this.set_currentConversation(conversation)
      await this.getMessageList(conversation) // 最后一条信息要添加到位
      var page = findComponentUpward(this, 'messagePage')
      if (this.isDesMobile) {
        this.$router.push(`/user/yiwu/message/mobile/detail/${conversation.conversationID}`)
        return false
      } else {
        page.scrollToBottom()
      }
    },
    async selectConversation (conversation) {
      if (conversation &&
          conversation.conversationID) {
        setCookie('cache_conversation_conversationID', conversation.conversationID)
      }

      /* 这个 convasation 的∏消息*/
      if (conversation.conversationID === this.currentConversation.conversationID) {
        // 如果是点击目前的 就不需切换聊天记录
        // if (this.isDesMobile) {
        //   this.$router.push(`/user/yiwu/message/mobile/detail/${this.currentConversation.conversationID}`)
        // }
        return false
      }
      this.set_currentConversation(conversation)
      // 如果是手机跳转手机
      if (this.isDesMobile) {
        this.$router.push(`/user/yiwu/message/mobile/detail/${conversation.conversationID}`)
        return false
      } else {
        // 1.切换会话前，将切换前的会话进行已读上报
        this.loadingClickConversation = true
        var currentConversation = window._vm.$store.state.message.currentConversation
        if (currentConversation.conversationID) {
          const prevConversationID = currentConversation.conversationID
          await window.tim.setMessageRead({ conversationID: prevConversationID })
        }
        // 2.待切换的会话也进行已读上报
        await window.tim.setMessageRead({ conversationID: conversation.conversationID })
        // clear 对话信息

        window._vm.$store.commit('message/set_currentMessageList', [])
        this.set_currentConversation(conversation)
        await this.getMessageList(conversation) // 最后一条信息要添加到位
        this.loadingClickConversation = false
        if (!this.isDesMobile) {
          var page = findComponentUpward(this, 'messagePage')
          console.log(page)
          page.scrollToBottom()
        }
      }
    },
    async ajaxGetSystemList () {
      // 获取收到的预约请求
      // getListReceived()
      // var result = await ajax.get(`/api3/message/newmessage/list/${user.id}`).then(res => res.data)
      // var result1 = await ajax.get(`/api3/message/newmessage/hadread/${user.id}`).then(res => res.data)
      // var systemGroupConversation = this.conversationList.filter(item => {
      //     item.type == 'GROUP' &&
      //     item.groupProfile.groupID === personage_system_group + getLoginUser().id
      // })
    },
    selectSystemItem () {
      commit_set_currentConversation('')
    },

  }

}
</script>

